//详情页
class Item {
  constructor() {
    this.getData();
  }
  //加入购物车方法
  static addCart(e) {
    // console.log(e);
    //获取发送ajax所需数据
    let id = localStorage.getItem("id");
    let userId = localStorage.getItem("user_id");
    let token = localStorage.getItem("token");
    // console.log(userId, token, id);
    //判断是否登录
    if (!userId) location.href = "./login.html";
    //此服务器所有需要登录后使用的接口,均在请求头内携带authorization字段, 传递token值方可
    axios.defaults.headers.common["authorization"] = token;
    //设置参数编码方式
    axios.defaults.headers["Content-Type"] =
      "application/x-www-form-urlencoded";
    //发送ajax请求
    let str = `id=${userId}&goodsId=${id}`;
    axios
      .post("http://localhost:8888/cart/add", str)
      .then(({ data, status }) => {
        //解构赋值
        if (data.code == 1 && status == 200) {
          layer.confirm(
            "要去购物车结算吗?",
            {
              btn: ["是的", "不去"], //按钮
            },
            function () {
              //跳转到指定页面
              location.assign("./cart.html");
            }
          );
        }
        //判断code值是否为0 为0则没有登录
        if (data.code == 0 && status == 200) {
          location.assign("./login.html");
        }
      })
      .catch((red) => {});
  }
  //商品信息渲染到页面上
  async getData() {
    //获取保存在localStorage中的id信息
    let id = localStorage.getItem("id");
    //发送ajax获取对应id商品信息
    let { data, status } = await axios.get(
      "http://localhost:8888/goods/item?id=" + id
    );
    // console.log(data.info, status);
    let info = data.info;
    // console.log(info.img_big_logo);
    //判断是否请求成功
    if (status != 200 && data.code != 1) return;
    //渲染
    let html = "";
    html += `<div class="fl preview-wrap">
            <div class="zoom">
                默认第一个预览
                <div id="preview" class="spec-preview">
                    <img class="xzoom" xoriginal="uploads/b1.png" src="${info.img_big_logo}" width="100%">
                </div>
            </div>
        </div>
        <div class="fr itemInfo-wrap">
            <div class="sku-name">
                <h4>${info.title}</h4>
            </div>
            <div class="summary">
                <div class="summary-wrap">
                    <div class="fl title"><i>价　 格</i></div>
                    <div class="fl price"><i>¥</i><em>${info.current_price}</em> <s>降价通知</s></div>
                    <div class="fr remark"><i>累计评价</i><em>612188</em></div>
                </div>
                <div class="summary-wrap">
                    <div class="fl title"><i>促　 销</i></div>
                    <div class="fl price">
                        <span>加价购</span>满999.00另加20.00元,或满1999.00另加30.00元,或满2999.00另加40.00元，<br />即可在购物车换购热销商品
                        <a href="#node">详情》</a>
                    </div>
                </div>
            </div>
            <div class="clearfix choose">
                <div class="summary-wrap">
                    <a href="#node" class="sui-btn  btn-danger addshopcar" onclick="Item.addCart(this)">加入购物车</a>
                </div>
            </div>
        </div>`;
    //追加到页面当中去
    this.$(".product-info").innerHTML = html;
  }
  //获取节点的方法
  $(ele) {
    let res = document.querySelectorAll(ele);
    return res.length == 1 ? res[0] : res;
  }
}
new Item();
